<%@page import="javax.swing.text.DateFormatter"%>
<%@page import="java.text.DateFormat"%>
<%@page import="java.util.Date"%>
<%@page import="org.ocpsoft.pretty.time.PrettyTime"%>
<%@ page language="java" isELIgnored="false" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<jsp:directive.include file="/WEB-INF/sitemesh-decorators/include.jsp" />

<script type="text/javascript">
	function showUploadPanel(id){
	   	$('input[name=fileInput' + id +']').val('');
		$('#versionUploadPanel' + id).slideToggle(250);
	}
	function hideUploadPanel(id){
		$('#versionUploadPanel' + id).slideUp(250);
	}
	function uploadNewVersion(id){
      	/* $.ajax({
   			url : '${pageContext.request.contextPath}/ajax/file/upload',
            type : "POST",
            enctype : "multipart/form-data",
            data: { currentRevisionID: id },
            dataType : "html",
            beforeSend : function() {
               $('#wait').show();
            },
            complete : function() {
               $('#wait').hide();
            },
            success : function(data) {
               $('#document-content').html(data);
            },
            error : function() {
               alert("Failure args: " + arguments);
            }
   		});
   		return false; */
   		$('#formNewVersion' + id).submit();
	}
</script>
<script type="text/javascript">
	function ShowRenamePanel(id){
      	$('input[name=newFolderName' + id + ']').val($('#viewFolder' + id + ' span').text());
      	$('#viewFolder' + id).hide();
      	$('#renamePanel' + id).show(1000);
   	}
   	function HideRenamePanel(id){
      	$('#span_error' + id).text('');
      	$('#renamePanel' + id).hide();
      	$('#viewFolder' + id).show(500);
   	}
	function renameFolder(id){
      	var folderName = $('input[name=newFolderName' + id + ']').val().trim();

      	$.ajax({
			url : '${pageContext.request.contextPath}/ajax/folder/' + id +'/rename',
            type : "POST",
            data: { folderName: folderName },
            dataType : "html",
            success : function(data) {
               if (data == "") {
                  $('#viewFolder' + id + ' span').text(folderName);
                  HideRenamePanel(id);
               } else {
                  $('#span_error' + id).text(data);
                  $('#span_error' + id).show();
               }
            },
            error : function() {
               alert("Failure args: " + arguments);
            }
		});
		return false;
	}
</script>

<div id="wait" style="display: none; z-index: 777; position: absolute; left: 35%; top: 37%">
   <p>
      <img src="${pageContext.request.contextPath}/images/ajax-loader.gif" />
   </p>
</div>
<div>
   <ul class="list documentlist">
      <!-- folders list -->
      <c:forEach items="${folders}" var="folder">
         <li>
            <div class="toolbarLeftHover">
               <div class="toolbar_left">
                  <div class="listMenu">
                     <div class="menuDropdown"></div>
                     <div class="menuBody">
                        <ul>
                           <!-- <li><a href="#" class="link" id="shareLink197" onclick="">Share this folder</a></li> -->
                           <!-- <li><a href="#" class="link" id="downloadLink198">Download</a></li> -->
                           <li><a href="#" class="link" id="moveLink199" onclick="">Move</a></li>
                           <li><a href="#" class="link" id="deleteLink19a" onclick="showDeletePanel(${folder.id});">Delete</a></li>
                           <li><a href="#" class="link" id="renameLink" onclick="ShowRenamePanel(${folder.id});">Rename</a></li>
                        </ul>
                     </div>
                  </div>
               </div>
            </div>
            <div class="fluid">
               <img class="icon" src="${pageContext.request.contextPath}/images/folder_doc.png"> <span
                  class="iconOverlay"></span> <input name="selectThis" id="selectThis" onclick="" type="checkbox">
               <div style="margin-left: 43px">
                  <table>
                     <tbody>
                        <tr>
                           <td>
                              <div>
                                 <span class="nowrap">
                                    <a id="viewFolder${folder.id}" href="${pageContext.request.contextPath}/folder/${folder.id}"><span>${folder.name}</span></a>
                                    <span id="renamePanel${folder.id}" style="display: none">
                                       <div class="labelEditor">
                                          <form id="renameForm" action="" method="post">
                                             <div style="width: 0px; height: 0px; position: absolute; left: -100px; top: -100px; overflow: hidden">
                                                <input id="renameForm_hf" type="hidden" name="renameForm_hf">
                                             </div>
                                             <input style="min-width: 210px; max-width: 210px;" class="Text Full" type="text" name="newFolderName${folder.id}" value="${folder.name}">
                                             <span id="span_error${folder.id}" style="color:red"></span>
                                             <a class="gcSubmit small" onclick="renameFolder(${folder.id});" href="#"> Update <span class="left"></span> <span class="right"></span>
                                             </a> or <a id="linkCancel" onclick="HideRenamePanel(${folder.id});" href="#">cancel</a>
                                          </form>
                                       </div>
                                    </span>
                                 </span>
                              </div>
                           </td>
                        </tr>
                     </tbody>
                  </table>
               </div>
            </div>
            <div class="spacer">&nbsp;</div>
         </li>
      </c:forEach>
      <!-- end folders list -->
   </ul>
</div>

<ul class="list documentlist" id="docListAreacc">
   <!-- documents & files list -->
   <c:forEach items="${files}" var="fr">
      <li>
         <div class="toolbarLeftHover">
            <div class="toolbar_left">
               <div class="listMenu">
                  <div class="menuDropdown"></div>
                  <div class="menuBody">
                     <ul>
                        <!-- <li><a href="#" class="link" id="shareLink1a8" onclick="">Share this file</a></li> -->
                        <li><a href="${pageContext.request.contextPath}/file/${fr.id}/download?rk=${fr.rowkey}"
                           class="link" id="downloadLink1a9">Download</a></li>
                        <li><a href="#" class="link" id="moveLink1aa" onclick="">Move</a></li>
                        <li><a href="${pageContext.request.contextPath}/file/${fr.id}/delete" class="link"
                           id="deleteLink1ab" onclick="">Delete</a></li>
                        <li><a href="javascript:void(0)" class="link" id="uploadNewLink${fr.id}" onclick="showUploadPanel(${fr.id});">Upload New
                              Version</a></li>
                        <li><a href="#" class="" style="" id="editPermissionsLink1ac" onclick=""><span>Edit
                                 Permissions</span></a></li>
                     </ul>
                  </div>
               </div>
            </div>
         </div>
         <div class="fixed">
            <div class="infos_dbline">
               <a class="comments" href="#"> <span class="byWhoArea"></span>
               </a>
               <table class="info">
                  <tbody>
                     <tr>
                        <c:set var="createdDate" value="${fr.createdDate.getTime()}"></c:set>
                        <td>Updated&nbsp;<span><%=new PrettyTime().format((Date) pageContext.getAttribute("createdDate"))%></span>
                           by&nbsp;<span class="docCreatedBy">${fr.userByCreatedBy.username}</span><br>
                        </td>
                     </tr>
                  </tbody>
               </table>
            </div>
            <span> <a class="profileThumb" href=""> <span class="thumbmask"> <span class="topleft"></span>
                     <span class="topright"></span> <span class="bottomleft"></span> <span class="bottomright"></span> <img
                     id="profileImg1ad" src="${pageContext.request.contextPath}/images/default_profile.png">
               </span>
            </a>
            </span>
         </div>
         <div class="fluid">
            <img class="icon" id="docType1ae" src="${pageContext.request.contextPath}/images/unknown.jpg"> <span
               class="iconOverlay"></span> <input name="selectThis" id="selectThis1af" onclick="" type="checkbox">
            <div style="margin-left: 43px">
               <table>
                  <tbody>
                     <tr>
                        <td>
                           <div>
                              <span id="labelContainer1b0"> <span> </span>
                              </span> <span class="nowrap"> <a href="${pageContext.request.contextPath}/document/${fr.id}"> <span>${fr.file.name}</span></a> - version <span
                                 class="currentVersionNumber">${fr.revision}</span>
                              </span>

                           </div>
                           <div class="summary"></div>
                        </td>
                     </tr>
                  </tbody>
               </table>
               <div class="versionUploadPanel" style="display: none" id="versionUploadPanel${fr.id}">
                  <form id="formNewVersion${fr.id}" method="post" action="${pageContext.request.contextPath}/ajax/file/upload?currentRevisionID=${fr.id}"
                     enctype="multipart/form-data">
                     <div style="width: 0px; height: 0px; position: absolute; left: -100px; top: -100px; overflow: hidden">
                        <input name="currentRevisionID" id="currentRevisionID" value="${fr.id}" type="hidden">
                     </div>
                     <label for="upload" class="f_left" style="line-height: 34px;">Newer version: </label> <input
                        id="upload" class="" style="" name="fileInput${fr.id}" type="file"> <a class="gcSubmit small"
                        href="javascript:void(0)" onclick="uploadNewVersion(${fr.id});">
                        Upload <span class="left"></span> <span class="right"></span>
                     </a> <span class="" style="line-height: 34px;">or <a id="closeLink${fr.id}"
                        href="javascript:void(0)" onclick="hideUploadPanel(${fr.id});">close</a></span>
                     <div class="spacer">&nbsp;</div>
                  </form>
                  <div class="spacer">&nbsp;</div>

                  <div class="wupb-container">
                     <div class="wupb-progressBar" style="display: none;" id="bar171">
                        <div class="wupb-border">
                           <div class="wupb-background">
                              <div class="wupb-foreground"></div>
                           </div>
                        </div>
                     </div>
                     <div class="wupb-uploadStatus" style="display: none;" id="status170"></div>
                  </div>

                  <div class="spacer">&nbsp;</div>
               </div>

            </div>
         </div>
         <div class="spacer">&nbsp;</div>

      </li>
   </c:forEach>
   <!-- end documents & files list -->
</ul>

<div>
   <div class="navigator">
      <c:if test="${isPages}">
            (<span>0</span>&nbsp;pages)
         </c:if>
   </div>
</div>